<template>
  <div class="recruitment">
    <div v-if="device==='desktop'||device==='ipad'" class="dswd-container">
      <first :filters.sync="filters" :city-list.sync="cityList" :type-list.sync="typeList" @searchJob="searchJob" />
      <second ref="second" :filters.sync="filters" :city-list.sync="cityList" :type-list.sync="typeList" />
    </div>
    <div v-if="device==='mobile'" class="dswd-m-container">
      <first :filters.sync="filters" :city-list.sync="cityList" :type-list.sync="typeList" @searchJob="searchJob" />
      <second ref="second" :filters.sync="filters" :city-list.sync="cityList" :type-list.sync="typeList" />
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex'
import first from './first'
import second from './second'
export default {
  components: { first, second },
  data() {
    return {
      cityList: [
        {
          id: '0',
          code: '',
          name: '不限'
        },
        {
          id: '1',
          code: 'zz',
          name: '郑州'
        },
        {
          id: '2',
          code: 'sz',
          name: '深圳'
        }
      ],
      typeList: [
        {
          id: '0',
          name: '不限',
          code: ''
        },
        {
          id: '1',
          name: '人资',
          code: 'HR'
        },
        {
          id: '2',
          name: '市场营销',
          code: 'RD'
        },
        {
          id: '3',
          name: '建筑工程',
          code: 'AR'
        },
        {
          id: '4',
          name: '开发',
          code: 'PG'
        },
        {
          id: '5',
          name: '财务',
          code: 'FD'
        }
      ],
      filters: {
        item: '',
        union: '',
        city: '',
        type: '',
        jobs: ''
      }
    }
  },
  computed: {
    ...mapState({
      device: (state) => state.app.device
    })
  },
  props: {
    jobType: {
      type: String,
      default: () => '1'
    }
  },
  mounted() {
    this.filters.item = this.jobType
  },
  methods: {
    searchJob() {
      this.$nextTick(() => {
        if (this.$refs.second) {
          this.$refs.second.getJobList()
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
